<template>
    <div class="flex bottomBox">
        <!-- <transition name="el-zoom-in-bottom">
            <div class="flex editBtnsGroup" v-show="false">
                <div class="editItem flex"></div>
                <div class="editItem boxShadow groups flex">
                    <div class="groupsItem point" ></div>
                    <div class="groupsItem line" ></div>
                    <div class="groupsItem circle" ></div>
                    <div class="groupsItem rect"></div>
                </div>
                <div class="editItem flex"></div>
                <div class="editItem flex"></div>
                <div class="editItem flex"></div>
                <div class="editItem flex"></div>
            </div>
        </transition> -->
        <div class="boxShadow authorCom">
            <div class="editItem flex" @click="submitSaveMap">
                <el-button native-type="button" size="medium" class="editMapBtn">保存地图</el-button>
            </div>
        </div>
    </div>    
</template>

<script>
import { submitSaveMapBtn } from '../js/methods'
export default {
    name: 'editMapFunction',
    components:{

    },
    data(){
        return{
           
        }
    },
    methods:{
      //点击提交
      submitSaveMap:function(){
          submitSaveMapBtn();
      }
      
    },

    //属性监听
    watch:{
       
    }

}
</script>

<style scoped lang="less">
.bottomBox{
    padding: 10px;
}
 .authorCom{
     background-color: #409EFF;
     color: #ffffff;
     border-top-left-radius: 4px;
     border-top-right-radius: 4px;
     padding: 10px;
     text-align: left;
     font-size: 14px;
     width: 100%;
     button{
         background: none;
         color: #ffffff;
     }
 }
 .editBtnsGroup{
     position: fixed;
     bottom: 40px;
     left: 60px;
     width: calc(100% - 120px);
     background: none;
     border-radius: 4px;
     text-align: left;
     font-size: 14px;
     z-index: 999;
 }
 .groups{
     background-color: #ffffff;
     flex-direction: column;
 }
 .groupsItem{
     height: 35px;
     width: 100%;
     background-size: 60%;
     background-repeat: no-repeat;
     background-position: center;
     border-bottom: 1px solid #eeeeee;
     &:last-child{
         border-bottom: none;
     }
 }
 .point{
     background-image: url("../../src/assets/icon-point.png");
 }
 .line{
     background-image: url("../../src/assets/icon-line.png");
 }
 .circle{
     background-image: url("../../src/assets/icon-circle.png");
 }
 .rect{
     background-image: url("../../src/assets/icon-rect.png");
 }
 .editItem{
     flex: 1;
     border-right: 1px solid #eeeeee;
     &:last-child{
         border-right: none;
     }
 }
.editMapBtn{
    border: none;
    padding: 0;
    
}
</style>